﻿@using NB.MGJ.Model
@{
    Layout = null;
    Organization_Enterprise e =ViewBag.Enterprise as Organization_Enterprise;
}

@*<script src="~/Scripts/WebUploader/webuploader.js"></script>*@
<script src="~/Scripts/WebUploader/webuploader.min.js"></script>
<script src="~/Scripts/Bootstrap/js/bootstrap-select.js" charset="utf-8" type="text/javascript"></script>
<link href="~/Scripts/Bootstrap/css/bootstrap-select.min.css" rel="stylesheet" />




<style>
    #thelist {
    }

    .btns {
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .btns #picker {
            /*background-color: blue;*/
        }

    #picker {
        position: relative;
    }

        #picker .webuploader-pick {
            display: block;
            width: 91px;
            height: 91px;
        }

        #picker input[type='file'] {
            opacity: 0;
            display: block;
            width: 91px;
            height: 91px;
            position: absolute;
            z-index: 99;
        }

    /*.img-thumbnail {
        position: relative;
    }*/
</style>

<form class="container" id="form_Enterprise" onkeydown="if(event.keyCode==13){return false;}">
    <div class="form-group row">
        <input name="ID" value="@e.ID" hidden />
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right"><span class="red-600">*</span>&nbsp;机构代码:</div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <input readonly="readonly" class="form-control" type="text" name="Code" value="@e.Code" />
        </div>

        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right"><span class="red-600">*</span>&nbsp;机构名称:</div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <input class="form-control" type="text" name="EnterpriseName" value="@e.EnterpriseName" placeholder="请输入机构名称" maxlength="20" />
        </div>
    </div>
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
            <span class="red-600">*</span>&nbsp;机构形式:
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <select class="form-control" id="OrganizationForm" readonly="readonly" onchange="$.MGJ.OrganizationalManage.Ajax_GetTypeBox($(this).val())" name="OrganizationForm"></select>
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
            机构类型:
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <select class="form-control" id="OrganizationId" readonly="readonly" name="OrganizationId"></select>
        </div>
    </div>
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
            <span style=" color:red;">*</span>
            <span>&nbsp;所在地:</span>
        </div>

        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <select class="form-control" id="ProvinceId" name="ProvinceId">
                <option>所在省</option>
            </select>
        </div>
        <div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
            <select class="form-control" id="City" name="City">
                <option>所在市</option>
            </select>
        </div>
        <div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
            <select class="form-control" id="Region" name="Region">
                <option>所在区</option>
            </select>
        </div>
    </div>

    <div class="form-group RowAlgnTop">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
            <span class="red-600">*</span>&nbsp;
            所处行业:
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">

            @*@Html.DropDownList("ClassifyId", null, new
                {
                    @class = "form-control dis"
                })*@
            <select data-dropup-auto="false" id="ClassifyId" name="ClassifyId" class="selectpicker show-tick form-control" multiple title="所处行业" data-live-search="false"></select>
        </div>
    </div>

    <div class="form-group RowAlgnTop">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
            <span class="red-600">*</span>&nbsp;
            服务版本:
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <select id="ServiceVersion" data-dropup-auto="false" name="ServiceVersion" class="selectpicker show-tick form-control forselect" multiple title="服务版本" data-live-search="false"></select>
        </div>
    </div>



    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">详细地址:</div>
        <div class="col-xs-10 col-sm-10 col-md-10 col-lg-10">
            <input class="form-control" type="text" name="Address" value="@e.Address" placeholder="请输入详细地址" maxlength="50" />
        </div>
    </div>
    @if (ViewBag.eId == 1)
    {
        <div class="form-group row">
            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right" style="padding:0">有效起始日期:</div>
            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <label><input name="endDate" type="radio" value="1" />&nbsp;一年</label>
            </div>
            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <label><input name="endDate" type="radio" value="2" />&nbsp;两年</label>
            </div>
            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <label><input name="endDate" type="radio" value="3" />&nbsp;三年</label>
            </div>
            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <label><input name="endDate" type="radio" value="5" />&nbsp;五年</label>
            </div>
            <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <label><input name="endDate" type="radio" value="100" />&nbsp;永久</label>
            </div>
            <input type="hidden" name="StartTime" value="@e.StartTime" />
            <input type="hidden" name="EndTime" value="@e.EndTime" />
        </div>
    }
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">联系人:</div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <input class="form-control" type="text" name="PersonCharge" value="@e.PersonCharge" id="PersonCharge" placeholder="请输入联系人" maxlength="20" />
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">手机:</div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <input class="form-control" type="tel" name="PersonMobile" id="PersonMobile" value="@e.PersonMobile" placeholder="请输入11位的手机号" maxlength="11" />
        </div>
    </div>
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">启用/停用:</div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
            <label><input name="ViewFlag" type="radio" value="1" />&nbsp;启动</label>
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
            <label><input name="ViewFlag" type="radio" value="0" />&nbsp;停用</label>
        </div>

        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">电话:</div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <input class="form-control" type="tel" name="LandlinePhone" value="@e.LandlinePhone" placeholder="如：0511-4405222、021-87888822" maxlength="13" />
        </div>
    </div>
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">系统默认账号:</div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <input type="text" value="@e.Code" readonly="readonly" class="form-control" name="loginName" id="loginName" />
        </div>

    </div>
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right" style="height:100px;line-height:100px">
            &nbsp;企业LOGO:

        </div>
        <div style="height:100px;line-height:100px" class="col-xs-10 col-sm-10 col-md-10 col-lg-10">

            <div id="thelist" class="uploader-list" style="display:flex;align-items:center">
                <div id="picker" style="background: url('/Content/webImgs/upLogo/cp_img_tj.png' );background-size:100% 100%;width:91px;height:91px;border-radius:5px;">
                </div>
                <input type="hidden" value="@e.Img" id="Logimg" name="img" />
            </div>
        </div>
    </div>
    <div class="form-group row">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 text-right">
            &nbsp;备注:
        </div>
        <div id="Remark" contenteditable="true" class="col-xs-10 col-sm-10 col-md-10 col-lg-10">
            @*<textarea class="form-control" name="Remark">@e.Remark</textarea>*@
            <input class="form-control" type="text" name="Remark" value="@e.Remark" />
        </div>
    </div>
</form>
<input type="hidden" id="selectClassifyId" value="@e.ClassifyId" />
<input type="hidden" id="serviceVersion" value="@e.ServiceVersion" />
<script>
 
    $(document).ready(function () {
        BindClassifyIdSelect();
        BindServiceVersionSelect();
    })
    function BindClassifyIdSelect() {

        var selectClassifyId = $("#selectClassifyId").val();
        var array = new Array();
        array = selectClassifyId.split(",");

        $.ajax({
            type: "POST",
            url: "/Product/GetClassifyByFatherId",
            data: { FatherId: 0 },
            success: function (result) {
                var list = result;
                var html = ""
                for (var i = 0; i < list.length; i++) {
                            html += "<option value='" + list[i].ID + "'>" + list[i].Name + "</option>"
                }
                $("#ClassifyId").append(html);
                $('#ClassifyId').selectpicker('val', array);
                $('#ClassifyId').selectpicker('refresh');
            }
        });
    }



    function BindServiceVersionSelect() {
    
        var selectServiceVersion = $("#serviceVersion").val();
        var array2 = new Array();
        array2 = selectServiceVersion.split(",");


        $.ajax({
            type: "POST",
            url: "/Manager/GetServiceVersionList",
            data: { FatherId: 0 },
            success: function (result) {
        
                var list = result;
                var html = ""
                var aa = list[0];
                for (var i = 0; i < list.length; i++) {

                    var key = list[i].Key
                    html += "<option value='" + key + "'>" + list[i].Value + "</option>"
                }
                $("#ServiceVersion").append(html);
                $('#ServiceVersion').selectpicker('val', array2);;
                $('#ServiceVersion').selectpicker('refresh');
            }
        });
    }


  
    var EnterpriseName = $("[name='EnterpriseName']").val()

    //input验证
    $('#form_Enterprise').bootstrapValidator({
        message: '类型名称不能为空',
        excluded: [':disabled'],
        fields: {
            EnterpriseName:{
                validators: {
                    notEmpty: {
                        message: '机构名称不能为空'
                    },
                    stringLength: {
                        max: 20,
                        message: '机构名称最大长度为20',
                    },
                    regexp: {
                        regexp: /^[a-zA-Z\u4e00-\u9fa5]+$/,
                        message: '机构名称只能输入中文和字母'
                    },
                    //threshold: 1, //有6字符以上才发送ajax请求，（input中输入一个字符，插件会向服务器发送一次，设置限制，6字符以上才开始）
                    //remote: {//ajax验证。server result:{"valid",true or false} 向服务发送当前input name值，获得一个json数据。例表示正确：{"valid",true}
                    //    type: "post",
                    //    url: "/Manager/CheckEnterparise",
                    //    message: '此机构名称已注册',
                    //    delay: 2000
                    //}
                }
            },
            OrganizationForm: {
                validators: {
                    notEmpty: {
                        message: '机构形式尚未选择'
                    },
                }
            },
            ClassifyId: {
                validators: {
                    notEmpty: {
                        message: '所处行业尚未选择'
                    },
                }
            },
            Address: {
                validators: {
                    stringLength: {
                        max: 50,
                        message: '详细地址最大长度为50',
                    }
                }
            },
            PersonMobile: {
                validators: {
                    regexp: {
                        regexp: /^1[0-9]{10}$/,
                        message: '手机号码格式错误'
                    }
                }
            },
            LandlinePhone: {
                validators: {
                    regexp: {
                        regexp: /^0\d{2,3}-\d{7,8}$/,
                        message: '电话号码格式错误'
                    }
                }
            },
            PersonCharge: {
                validators: {
                    regexp: {
                        regexp: /^[a-zA-Z0-9\u4e00-\u9fa5]+$/,
                        message: '联系人不能输入符号'
                    },
                    stringLength: {
                        max: 20,
                        message: '联系人最大长度为20',
                    },
                }
            }
        }
    });

 
    $("[name='EnterpriseName']").on("change", function () {
        if ( $("[name='EnterpriseName']").val() != EnterpriseName ) {
            
            $('#form_Enterprise').bootstrapValidator("addField", "EnterpriseName", {//添加验证
                validators: {
                    //是否注册
                    threshold: 1, //有1字符以上才发送ajax请求，（input中输入一个字符，插件会向服务器发送一次，设置限制，6字符以上才开始）
                    remote: {//ajax验证。server result:{"valid",true or false} 向服务发送当前input name值，获得一个json数据。例表示正确：{"valid",true}  
                        type: "post",  
                        url: "/Manager/CheckEnterparise?EnterpriseName=" + $("[name='EnterpriseName']").val(),
                        message: '此机构名称已注册',
                    }
                }
            });
        } else {
            $('#form_Enterprise').bootstrapValidator('removeField', 'EnterpriseName');//去除验证
        }
        $('#form_Enterprise').bootstrapValidator('validate');
        var bv = $('#form_Enterprise').data("bootstrapValidator")
        var bool = bv.isValid();

    })
 
        //var applicationPath = window.applicationPath === "" ? "" : window.applicationPath || "../../";
        $(function () {
        //寻找年限
        var st="@e.StartTime";
            var et = "@e.EndTime";
            $my.GetPCR("@e.ProvinceId", "@e.City", "@e.Region");
        var ett=parseInt(et.split('/')[0])-parseInt(st.split('/')[0]);
        if(ett===0 || ett===1)
        {
            $('#form_Enterprise .row').find('input[type="radio"][value="1"]').attr('checked','checked');
        }
        else{
            if(ett>=100)
            {
                $('#form_Enterprise .row').find('input[type="radio"][value="100"]').attr('checked','checked');
            }
            else{
                $('#form_Enterprise .row').find('input[type="radio"][value="'+ett+'"]').attr('checked','checked');
            }
        }
            //是否启用
        var ViewFlag = "@e.ViewFlag";
            if (ViewFlag === '1')
            {
                $('#form_Enterprise .row').find('input[name="ViewFlag"][type="radio"][value="1"]').attr('checked', 'checked');
            }
            else {
                $('#form_Enterprise .row').find('input[name="ViewFlag"][type="radio"][value="0"]').attr('checked', 'checked');
            }
       
            $.MGJ.OrganizationalManage.Ajax_GetFormBox(@ViewBag.rid,'@e.OrganizationForm');
            $.MGJ.OrganizationalManage.Ajax_GetTypeBox("@e.OrganizationForm", "@e.OrganizationId");
 
            if ($("#Logimg").val() != '') {
                $('#picker').hide();
                $('#thelist').prepend("<div class='img-thumbnail'><img src='" + $("#Logimg").val() + "' style='width:91px;height:91px' /></div>");

                $('#thelist > .img-thumbnail').eq(0).mouseenter(function () {
                    var url = $(this).find('img').attr('src');
                    $(this).attr('name', url).find('img').css({ 'width': '91px', 'height': '91px' }).attr('src', '/Content/webImgs/upLogo/cp_img_sc.png');
                }).mouseleave(function () {
                    var url = $(this).attr('name');
                    $(this).find('img').attr('src', url);
                }).click(function () {
                    $(this).remove();
                    $('#picker').css('display', 'inline-block');
                    isUpload = 0;
                });
            }
            else {
                $('#picker').mouseenter(function () {
                    $(this).css('background', 'url("/Content/webImgs/upLogo/cp_img_tj_a.png")');
                }).mouseleave(function () {
                    $(this).css('background', 'url("/Content/webImgs/upLogo/cp_img_tj.png")');
                });
            }

            var uploader = WebUploader.create({
                // swf文件路径
                //        swf: BASE_URL + '/js/Uploader.swf',
                //指定拖拽容器
                dnd: '#thelist',
                //截图可粘贴区域
                paste: 'document.body',

                // 文件接收服务端。
                server: '/OriginsMaterial/Upload',

                // 选择文件的按钮。可选。
                // 内部根据当前运行是创建，可能是input元素，也可能是flash.
                pick: {
                    id: '#picker',
                    multiple:false
                },
                accept: {
                    title: 'Images',
                    extensions: 'gif,jpg,jpeg,bmp,png',
                    mimeTypes: 'image/jpg,image/jpeg,image/png'
                },

                // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
                resize: false
            });
            // 当有文件添加进来的时候
            uploader.on('fileQueued', function (file) {
                uploader.upload();
                var $li = $(
                                '<div id="' + file.id + '" class="img-thumbnail">' +
                                '<img alt="null"/>' +
        //                        '<p class="info">' + file.name + '</p>' +
                                '</div>'
                        ),
                        $img = $li.find('img');


                // $list为容器jQuery实例
                $('#thelist').prepend($li);

                // 创建缩略图
                // 如果为非图片文件，可以不用调用此方法。
                // thumbnailWidth x thumbnailHeight 为 100 x 100
                uploader.makeThumb(file, function (error, src) {
                    if (error) {
                        $img.replaceWith('<span>不能预览</span>');
                        return;
                    }
                    $img.attr('src', src);
                }, 91, 91);
                $('#thelist > .img-thumbnail').eq(0).mouseenter(function () {
                    var url = $(this).find('img').attr('src');
                    $(this).attr('name', url).find('img').attr('src', '/Content/webImgs/upLogo/cp_img_sc.png');
                }).mouseleave(function () {
                    var url = $(this).attr('name');
                    $(this).find('img').attr('src', url);
                }).click(function () {
                    $(this).remove();
                    $('#picker').css('display', 'inline-block');
                });

                $('#picker').css('display', 'none');
            });
            // 文件上传过程中创建进度条实时显示。
            uploader.on('uploadProgress', function (file, percentage) {
                var $li = $('#' + file.id),
                        $percent = $li.find('.progress span');

                // 避免重复创建
                if (!$percent.length) {
                    $percent = $('<p class="progress"><span></span></p>')
                            .appendTo($li)
                            .find('span');
                }

                $percent.css('width', percentage * 100 + '%');
            });

            // 文件上传成功，给item添加成功class, 用样式标记上传成功。
            uploader.on('uploadSuccess', function (file,r) {
               
                var result = r._raw.split("。")[1];
                $("#Logimg").val(result);
                $('#' + file.id).addClass('upload-state-done');
            });

            // 文件上传失败，显示上传出错。
            uploader.on('uploadError', function (file) {
                
                var $li = $('#' + file.id),
                        $error = $li.find('div.error');
                // 避免重复创建
                if (!$error.length) {
                    $error = $('<div class="error" style="position: relative"></div>').appendTo($li);
                }
                $error.text('上传失败');
                $error.append($('<span class="glyphicon glyphicon-remove" style="position: absolute;right: 0;color: green;font-size: 18px"></span>'))
            });

            // 完成上传完了，成功或者失败，先删除进度条。
            uploader.on('uploadComplete', function (file) {
                $('#' + file.id).find('.progress').remove();
            });

            //function up() {
            //    uploader.upload();
            //}
            $('#thelist #ctlBtn').click(function () {
                uploader.upload();
            })

        });


</script>
